body{
    height: 100%;
    width: 100%;
    margin:0px;
}
.head_img img {
    height: 20%;
    width:100%;

}
.container .box{
    margin-bottom: 158px;
}
.container .box .swiper-container{
    position: relative;
    width: 1100px;
    height: 730px;
}
.container .box .swiper-container .swiper-pagination{
    bottom: 58px;
    left: 47%;
    width: 100%;
    color: #ffffff;
}
.container .box .swiper-container .swiper-button-prev {
    width: 48px;
    height: 72px;
    background-color:rgba(39, 107, 240, 0.5);
    opacity: 1;
    position: absolute;
    right: auto;
    left: 0;
}
.container .box .swiper-container .swiper-button-next{
    width: 48px;
    height: 72px;
    background-color:rgba(39, 107, 240, 0.35);
    opacity: 0.9;
    position: absolute;
    right: 0;
    left: auto;
}

.container .box .title{
    width: 100%;
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;

}
.container .box .title a{
    padding: 8px 18px;
    font-size: 36px;
    font-weight: bold;
    letter-spacing: 5px;
    background-image: linear-gradient(to right, #276BF0, #20217B);
    -webkit-background-clip: text;
    color: transparent;
    text-decoration: none;
    border: 2px solid ;
    border-image: linear-gradient(to right, #276BF0, #20217B) 1 / 1 / 0 stretch stretch;
    position: relative;
    display: inline-block;
}
.container .box .title a::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: -18px;
    height: 1px;
    background: linear-gradient(to right, #276BF0, #20217B);
    width: 68px;
    margin: 0 auto;
}

.container .box .swiper{
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 38px auto;
    position: relative;
}
.container .box .swiper .img{
    height: 730px;
    width: 100%;

}

.container .box .swiper .sign{
    width:100%;
    height: 80px;
    background-color: #276BF0;
    opacity: 0.6;
    position: absolute;
    bottom: 38px;
}
.container .box .swiper .sign a{
    line-height: 80px;
    margin-left: 20px;
    font-size: 18px;
    color: #ffffff;
    letter-spacing: 2px;
}

.container .box  .content{
    width: 1100px;
    display: flex;
    flex-direction: row;
    align-items: center;
    margin: 38px auto 0 auto;
}
.container .box  .content .img_left{
    height: 420px;
    width: 55%;
}
.container .box  .content .img_left img{
    width: 100%;
    height: 100%;
}
.container .box  .content .sign_right{
    height: 420px;
    width: 45%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    letter-spacing: 2px;
}

.container .box .content .sign_right a {
    flex: 1;
    position: relative;
    color: #333;
    text-decoration: none;
    border-bottom: 1px dashed #276BF0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-left: 18px;
}

.default-active::before,
.container .box .content .sign_right a:hover::before,
.container .box .content .sign_right a:focus::before {

    content: ''; /* 伪元素内容为空 */
    position: absolute;
    left: -35px; /* 左侧对齐 */
    top: 50%;
    transform: translateY(-50%);
    border-width: 18px; /* 三角形的边长，根据需要调整 */
    border-style: solid;
    background-image: linear-gradient(to right, #276BF0, #20217B);
    border-color: transparent #276BF0 transparent transparent ; /* 透明透明透明蓝色 */
}

/* 鼠标悬停和聚焦时的文字颜色 */
.default-active,
.container .box .content .sign_right a:hover,
.container .box .content .sign_right a:focus {
    color: white;
    background-image: linear-gradient(to right, #276BF0, #20217B);
}
.sign_right a.default-active {
    color: #fff; /* 激活状态下的文字颜色 */
    background: linear-gradient(to right, #276BF0, #20217B); /* 激活状态下的背景渐变色 */
}
.container .box .more{
    width: 1100px;
    display: flex;
    align-items: center;
    justify-content: end;
    margin: 0 auto;
    margin-top: 8px;
}

.container .box .more a{
    height: 25px;
    line-height: 25px;
    width: 54px;
    background-image: linear-gradient(to right, #276BF0, #20217B);
    color: #ffffff;
    font-size: 12px;
    padding: 2px 4px;
    display: flex;
    justify-content: center;
    align-items: center;
    letter-spacing: 2px;
}
.container .box .content .left_one{
    width: 46%;
    height: 365px;
    margin-right: 8px;
    position: relative;
}

.container .box .content .left_one .img{
    width: 100%;
    height: 100%;
}
.container .box .content .left_one .overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 70%;
    background: linear-gradient(to top, rgba(39, 107, 240, 0.8), rgba(32, 33, 123, 0.3), rgba(255, 255, 255, 0)); /* 从透明到半透明渐变 */
    opacity: 1;
}
.container .box .content .left_one a{
    font-size: 14px;
    width: 80%;
    position: absolute;
    margin-left: 8px;
    margin-bottom: 8px;
    left: 0;
    bottom: 0;
    color: #ffffff;
    display: block; /* 使<a>标签表现得像块级元素 */
    white-space: nowrap; /* 确保文本在一行内显示 */
    overflow: hidden;
    text-overflow: ellipsis; /* 超出部分用省略号表示 */
}

.container .box .content .right_four {
    width: 54%;
    height: 365px;
    display: flex;
    flex-wrap: wrap;
}
.container .box .content .four_img_left  {
    margin-right: 11px;
}
.container .box .content .right_four .img_box {
    width: 49%;
    height: 49%;
    margin-bottom: 8px;
    display: flex;
    flex-wrap: wrap;
    position: relative;
}

.container .box .content .right_four .img_box .overlay{
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 100%;
    background:rgba(39, 107, 240, 0.35);
    opacity: 1;
}

.container .box .content .right_four .img_box a{
    display: block;
    width: 55%;
    height: 40%;
    position: absolute;
    bottom: 20%;
    left: 30%;
    color: #ffffff;
    font-size: 14px;
    letter-spacing: 2px;
}
.container .box .content .right_four .img_box .img {
    width: 100%;
    height: 100%;
}
.container .box .content .right_four .img_box  .img_btm{
    width: 100%;
    height: 100%;
}
.container .box .content .left_one .overlay,
.container .box .content .right_four .overlay {
    display: none; /* 默认不显示 */
}

.container .box .content .left_one a,
.container .box .content .right_four .img_box a {
    display: none; /* 默认不显示 */
}

.container .box .content .left_one:hover .overlay,
.container .box .content .right_four .img_box:hover .overlay {
    display: block; /* 鼠标悬停时显示 */
}

.container .box .content .left_one:hover a,
.container .box .content .right_four .img_box:hover a {
    display: block; /* 鼠标悬停时显示 */
}

.container .box .content .left_one:active .overlay,
.container .box .content .right_four .img_box:active .overlay {
    display: block; /* 鼠标点击时显示 */
}

.container .box .content .left_one:active a,
.container .box .content .right_four .img_box:active a {
    display: block; /* 鼠标点击时显示 */
}
.container .box .parent{
    width: 1100px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin:0 auto;
}
.container .box .parent .parent_box{
   width: 50%;
}

.container .box .parent .parent_box .content{
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: baseline;
    justify-content: center;
}
.container .box .parent .parent_box .content_right{
    align-items: end;
}

.container .box .parent .parent_box .content a{
    height: 70px;
    width: 90%;
    flex: 1;
    position: relative;
    color: #333;
    letter-spacing: 2px;
    text-decoration: none;
    border-bottom: 1px dashed #276BF0;
    line-height: 70px;
    display: block;
    white-space: nowrap; /* 确保文本在一行内显示 */
    overflow: hidden;
    text-overflow: ellipsis; /* 超出部分用省略号表示 */
}
.container .box .parent_box .more{
    width: 80%;
    display: flex;
    align-items: center;
    justify-content: end;
    margin: 0 auto;
    margin-top: 8px;
}
.container .box .parent_box .more_right{
    width: 100%;
}

.container .box .kid_show{
    width: 1130px;
    height: 310px;
    margin: 0 auto;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    margin-top: 68px;
}
.container .box .kid_show .swiper{
    display: flex;
    flex: 1;
    height: 100%;
    align-items: center;
    justify-content: center;
    margin: 0 15px;
    position: relative;
}
.container .box .kid_show .swiper .img {
    height: 100%;
    width: 100%;
}
.container .box .kid_show .swiper .sign {
    width: 100%;
    height: 58px;
    background-color: #276BF0;
    opacity: 0;
    position: absolute;
    bottom: 0;
    transition: opacity 0.5s ease; /* 平滑过渡效果 */
    display: flex;
    justify-content: center;
    align-items: center;
    color: white;
    font-size: 16px;
    overflow: hidden; /* 隐藏超出部分 */
    text-overflow: ellipsis; /* 超出部分显示省略号 */
    white-space: nowrap; /* 保持文本在一行内 */
}

.container .box .kid_show .swiper .sign a {
    font-size: 14px;
    color: white; /* 链接颜色 */
    text-decoration: none; /* 去除下划线 */
    overflow: hidden; /* 隐藏超出部分 */
    text-overflow: ellipsis; /* 超出部分显示省略号 */
    white-space: nowrap; /* 保持文本在一行内 */
    display: inline-block;
}

.container .box .kid_show .swiper:hover .sign,
.container .box .kid_show .swiper:active .sign {
    opacity: 0.8; /* 鼠标悬停或点击时显示 */
}
